import { InjectionKey } from "vue"
import { createStore, createLogger,useStore as baseUseStore,Store as vuexStore} from "vuex"
// import createPersistedState from 'vuex-persistedstate'  //会话存储插件

import { store as permission, PermissionStore, PermissionState } from "@/store/modules/permission/index"
import { store as user, UserStore, UserState } from "@/store/modules/user/index"


// 为 store state 声明类型
export interface RootState{
  app:""
  settings:""
  permission:PermissionState
  user:UserState
}

/**
 * 获取 permissionState 从  RootState 中
 */
export type Store = PermissionStore<Pick<RootState,"permission">> &
      UserStore<Pick<RootState,"user">>


// 在开发环境中开启日志
const debug = process.env.NODE_ENV !== 'production'
const plugins = debug ? [createLogger({})] : []

// 使用基于 会话(session) 存储插件  
// plugins.push(createPersistedState({ storage: window.sessionStorage }))



export const store = createStore({
  plugins,
  modules:{
    permission,
    user
  }
})

/**  定义 injection key
  *  InjectionKey 将store安装到Vue应用程序时提供类型,将类型传递InjectionKey给useStore方法
  */
export const key: InjectionKey<vuexStore<RootState>> = Symbol()

// 定义自己的 `useStore` 组合式函数
export function useStore() {
	return baseUseStore(key)
}

// 定义自己的 `useStore` 组合式函数
// export function useStore(): Store{
//   return store as Store
// }